import type { RouteLocationNormalizedLoaded } from 'vue-router'
import type { TagsViewState, TagView } from './types/tagsView'
import { store } from '@/stores'

const adminPrefix = import.meta.env.VITE_ADMIB_PREFIX
// 首页
const tagsFitst: TagView = {
  path: `${adminPrefix}/welcome`,
  title: '首页',
  name: 'AdminWelcome',
  icon: 'fluent:home-32-regular',
}
export const useTagsView = defineStore(`${import.meta.env.VITE_NAMESPACE}-tags-view`, {
  state: (): TagsViewState => {
    return {
      tagsViewList: [
        tagsFitst,
      ],
      activeTag: tagsFitst.path,
    }
  },
  actions: {
    /**
     * 设置激活的标签
     * @param path
     */
    setActiveTag(path: string) {
      this.activeTag = path
    },
    /**
     * 添加标签
     * @param tageItem 标签
     * @param router 当前路由
     */
    addTagsView(tageItem: TagView, router: RouteLocationNormalizedLoaded) {
      if (!router.meta.showTag)
        return
      if (this.tagsViewList.findIndex((item: TagView) => item.path === tageItem.path) === -1) {
        this.tagsViewList.push(tageItem)
      }
    },
    /**
     * 关闭当前
     * @param tageItem
     * @param callback
     */
    closeCurrent(tageItem: TagView, callback: (item: TagView) => void) {
      if (this.tagsViewList.length === 1)
        return
      const index = this.tagsViewList.findIndex((item: TagView) => item.path === tageItem.path)
      if (index === 0)
        return
      this.tagsViewList.splice(index, 1)
      if (this.activeTag === tageItem.path) {
        callback(this.tagsViewList[index - 1])
      }
    },
    /**
     * 关闭左侧
     * @param tageItem
     * @param callback
     */
    closeLeft(tageItem: TagView, callback: (item: TagView) => void) {
      const index = this.tagsViewList.findIndex((item: TagView) => item.path === tageItem.path)
      // 判断当前激活的tag是否在当前关闭的tag的左侧，如果是则跳转当前tag
      if (this.activeTag !== tageItem.path) {
        for (let i = index - 1; i >= 0; i--) {
          if (this.activeTag === this.tagsViewList[i].path) {
            callback(tageItem)
            break
          }
        }
      }
      if (index > 0) {
        this.tagsViewList.splice(1, index - 1)
      }
    },
    /**
     * 关闭右侧
     * @param tageItem
     * @param callback
     */
    closeRight(tageItem: TagView, callback: (item: TagView) => void) {
      const index = this.tagsViewList.findIndex((item: TagView) => item.path === tageItem.path)
      // 判断当前激活的tag是否在当前关闭的tag的右侧，如果是则跳转当前tag
      if (this.activeTag !== tageItem.path) {
        for (let i = index + 1; i < this.tagsViewList.length; i++) {
          if (this.activeTag === this.tagsViewList[i].path) {
            callback(tageItem)
            break
          }
        }
      }
      if (index < this.tagsViewList.length - 1) {
        this.tagsViewList.splice(index + 1, this.tagsViewList.length - index - 1)
      }
    },
    /**
     * 关闭其它
     * @param tageItem
     */
    closeOther(tageItem: TagView) {
      // 找到当前标签的索引
      const currentIndex = this.tagsViewList.findIndex(
        (item: TagView) => item.path === tageItem.path,
      )
      const firstItemIndex = this.tagsViewList.findIndex((item: TagView) => item.path === tagsFitst.path)
      // 过滤掉除了当前标签和第一项之外的所有标签
      this.tagsViewList = this.tagsViewList.filter(
        (item: TagView, index: number) => index === currentIndex || index === firstItemIndex,
      )
    },
    /**
     * 全部关闭
     * @param tageItem
     * @param callback
     */
    closeAll(tageItem: TagView, callback: (item: TagView) => void) {
      // 保留数组的第一项，如果存在
      if (this.tagsViewList.length > 0) {
        this.tagsViewList = [this.tagsViewList[0]]
        callback(this.tagsViewList[0])
      }
      else {
        this.tagsViewList = [] // 如果数组为空，则清空
      }
    },
    /**
     * 清空
     */
    clearTagsView() {
      this.tagsViewList = [
        tagsFitst,
      ]
      this.activeTag = tagsFitst.path
    },
  },
  persist: true,

})

export function useTagsViewStoreHook() {
  return useTagsView(store)
}
